<template>
 <div>
  <common-head :title="$route.name"/>
  <div class="wrap">
    <!-- 订单收货地址 -->
      <van-contact-card
        :type="contactType"
        :name="contact.linkMan"
        :tel="contact.mobile"
        @click="clickContact"
      />
    <!-- /订单收货地址 -->

    <!-- 购买的商品 -->
    <div class="items">
        <van-card
          v-for="item in items"
          :key="item.id"
          :num="item.number"
          :price="item.price"
          :title="item.name"
          :thumb="item.pic"
        />
    </div>
    <!-- /购买的商品 -->
  </div>
    <van-submit-bar :price="total*100" button-text="下单" @submit="onSubmit" />
 </div>
</template>

<script>
import { fetchContacts, fetchCartItems, fetchContactInfo } from '_api'
import CommonHead from '../../components/CommonHead.vue'
import { getToken } from '_utils'
export default {
  data () {
    return {
      contactType: 'add',
      contact: {
        linkMan: '',
        mobile: ''
      },
      items: [], // 下单所有商品
      total: 0
    }
  },
  created () {
    this.fetchOrderContact()
    this.fetchItems()
  },
  methods: {
    fetchItems () {
      // 获取下单的商品
      fetchCartItems({
        token: getToken()
      }).then(res => {
        if (res.data.code === 0) {
          this.items = res.data.data.items.filter(item => item.selected)
          this.total = res.data.data.price
        }
      })
    },
    fetchOrderContact () {
      // 如果从 联系人列表会 传 id 判断是否有id 有 直接等于 这个id对应联系人
      if (this.$route.query.contactId) {
        fetchContactInfo({
          id: this.$route.query.contactId,
          token: getToken()
        }).then(res => {
          this.contact = res.data.data.info
          this.contactType = 'edit'
        })
        return false
      }
      /*
        获取所有的收货地址
          先判断 code是否是 700 收货地址列表中没有联系人 contactType add
          否则
          优先选择 收货地址列表中默认地址 （isDefault: true）
          如果没有默认收货地址
            收货地址 应该是 联系人列表中的 第一个
      */
      // 获取订单联系人
      fetchContacts({
        token: getToken()
      }).then(res => {
        if (res.data.code === 700) {
          // 没有收货地址
          this.contactType = 'add'
        }
        if (res.data.code === 0) {
          // 判断是否有默认联系人
          this.contactType = 'edit'
          const contacts = res.data.data.result
          const defaultContact = contacts.find(contact => contact.isDefault)
          if (defaultContact) {
            // 有默认联系人
            this.contact = defaultContact
          } else {
            // 第一个联系人
            this.contact = contacts[0]
          }
        }
      })
    },
    clickContact () {
      // 进入联系人列表
      this.$router.push('/contactlists')
    },
    onSubmit () {
      // 创建订单 成功后 自动跳转到 支付页面
    }
  },
  components: {
    CommonHead
  }
}
</script>

<style lang="scss" scoped>
.wrap{
  padding-top: 46px;
  padding-bottom: 50px;
}
</style>
